import {useEffect, useState} from "react";
import {Editor} from "@bytemd/react";
import gfm from "@bytemd/plugin-gfm";
import gfmLocale from "@bytemd/plugin-gfm/locales/zh_Hans.json";
import highlight from "@bytemd/plugin-highlight";
import locale from "bytemd/locales/zh_Hans.json";
import CodeCopy from "@comps/CopyCode";
import "bytemd/dist/index.css";
import "./index.less";
import "highlight.js/styles/vs.css";
import {getArticleDetailAPI} from "@api/Article";
import Markdown from "@comps/MarkDown/index";

const plugins = [
    gfm({
        locale: gfmLocale
    }),
    highlight(),
    CodeCopy()
];

// 存储文章 id
let currentArticleId: string

/**
 * Markdown 编辑器
 */
function MdEditor() {
    useEffect(() => {
        // 获取路径
        const path = window.location.pathname;
        if (path !== '/mkbk/article/add') {
            document.title = "添加文章";
            currentArticleId = path.split('/').pop() as string;
            if (currentArticleId) {
                document.title = "编辑文章";
                setArticleId(true);
                // 发送请求获取文章详情
                getArticleDetailAPI(currentArticleId).then((res) => {
                    if (res.data.code === 3000) {
                        setValue(res.data.data.content)
                    }
                })
            }
        }
    }, []);
    // 用于记录文章状态 是否是编辑状态
    const [articleId, setArticleId] = useState(false);
    const [value, setValue] = useState<string>("");
    return (
        <>
            <div className="md-editor">
                <Markdown></Markdown>
            </div>
        </>
    
    );
};

export default MdEditor;

